<template>
  <div id="fangTop">
    <van-icon
      name="back-top"
      size="8vw"
      style="border:1px solid #000;border-radius:100px;background-color:green;"
      color="red"
      v-if="scrolltopfalt"
      @click="scrollClick"
    />
  </div>
</template>
<script>
export default {
  props: ['scrolltopfalt'],
  data: () => ({
    scrolltopfaltes: '',
    n: 0
  }),
  methods: {
    scrollClick () {
      var timer = setInterval(() => {
        this.n = parseInt(document.documentElement.scrollTop)
        this.n = this.n--
        document.documentElement.scrollTop = this.n + 'px'
        console.log(this.n)
        if (this.n <= 0) {
          document.documentElement.scrollTop = 0
          clearInterval(timer)
          this.scrolltopfaltes = false
          this.$emit('scrollemit', this.scrolltopfaltes)
        }
      })
    }
  },
  watch: {
    'scrolltopfalt' (newscroll) {
      console.log(newscroll)
    }
  }
}
</script>
<style lang="scss" scoped>
#fangTop {
  text-align: center;
  position: fixed;
  right: 10vw;
  top: 150vw;
}
</style>
